<template>
    <div style="width: 100%; height: 100%;">
        <van-nav-bar title="个人中心" />
        <div class="box">
            <img :src="store.data.imgs" alt=""
                style="border-radius: 50%; width: 100px; height: 100px; float: left; margin-left: 80px;">
            <p style=" float: left; margin-left: 10px; margin-top: 30px ; font-size: 20px; font-weight: 800;">{{
                store.data.names }}</p>
        </div>
        <div class="box1">
            <van-grid style="width: 100%;">
                <van-grid-item icon="bars" text="全部订单" />
                <van-grid-item icon="card" text="待支付" />
                <van-grid-item icon="records" text="评价" />
                <van-grid-item icon="todo-list" text="售后" />
            </van-grid>
        </div>
        <div>
            <div style="height: 20px;"></div>
            <van-cell is-link title="地址管理" @click="show = true" />
            <van-cell is-link title="我的优惠券" @click="show = true" />
            <van-cell is-link title="优先购买码" @click="show = true" />
            <div style="height: 20px;"></div>
            <van-cell is-link title="常见问题" @click="show = true" />
            <van-cell is-link title="服务支持" @click="show = true" />
            <div style="height: 20px;"></div>
            <van-cell is-link title="意外碎屏保修服务" @click="show = true" />
        </div>
    </div>
</template>

<script setup>
import { useCounterStore } from '@/stores/user'
// 在组件内部的任何地方均可以访问变量 `store` ✨
const store = useCounterStore()
console.log(store.data);

</script>

<style lang="scss" scoped></style>